.hv-exception {
    display    : flex;
    align-items: center;
    height     : 100%;
    overflow   : hidden;

    .hv-img-block {
        flex         : 0 0 56%;
        width        : 56%;
        padding-right: 80px;
        zoom         : 1;

        &::before,
        &::after {
            content: " ";
            display: table;
        }

        &::after {
            clear     : both;
            height    : 0;
            font-size : 0;
            visibility: hidden;
        }
    }

    .hv-img-ele {
        float              : right;
        width              : 100%;
        max-width          : 600px;
        height             : 360px;
        background-repeat  : no-repeat;
        background-position: 50% 50%;
        background-size    : contain;
    }

    .hv-img-ele-not-found {
        background-image: url("../../assets/img/exception/404.svg");
    }

    .hv-content {
        flex: auto;

        h2 {
            margin-bottom: 24px;
            color        : var(--hv-text-color);
            font-weight  : 600;
            font-size    : 60px;
            line-height  : 60px;
        }

        .hv-desc {
            margin-bottom: 16px;
            color        : var(--hv-text-color-secondary);
            font-size    : 19px;
            line-height  : 26px;
        }

        .hv-actions {
            button:not(:last-child) {
                margin-right: 8px;
            }
        }
    }
}

@media screen and (max-width: @screen-xl) {
    .hv-exception {
        .hv-img-block {
            padding-right: 20px;
            padding-left : 20px;
        }
    }
}

@media screen and (max-width: @screen-sm) {
    .hv-exception {
        .hv-img-block {
            padding-right: 20px;
            padding-left : 20px;
        }

        .hv-content {
            h2 {
                font-size: 40px;
                margin-bottom: 5px;
            }

            .hv-desc {
                font-size: 15px;
                margin-bottom: 5px;
            }
        }
    }
}

@media screen and (max-width: @screen-xs) {
    .hv-exception {
        .hv-img-block {
            padding-right: 20px;
            padding-left : 20px;
        }
        .hv-content {
            h2 {
                font-size: 30px;
                margin-bottom: 5px;
            }

            .hv-desc {
                font-size: 13px;
                margin-bottom: 5px;
            }
        }
    }
}